<template>
	<view class="container">
		<u-toast ref="uToast"></u-toast>
		<view class="logo">
			<image src="@/static/lg_logo.png" />
			<view>
				<view class="text-h">绿港云集团办公</view>
				<view class="text-f">打造企业私有沟通平台</view>
			</view>
		</view>
		<view>
			<view class="form">
				<view class="input"><input type="text" name="username" required v-model.trim="loginForm.username"
						placeholder="请输入账号" /></view>
				<view class="input"><input type="password" name="password" required v-model.trim="loginForm.password"
						placeholder="请输入密码" /></view>
			</view>
			<view class="submit">
				<view>
					<button type="primary" class="login-btn" @click="handleLogin">登录</button>
				</view>
			</view>
			<view class="forget" @click="handleForgot">
				忘记密码
			</view>
		</view>

	</view>
</template>

<script>
	import base from '@/apis/cloud/base.js'
	import {
		useLoginStore,
		useUserStore
	} from "@/pinia-store/user.js"
	import graceChecker from '@/utils/graceChecker.js'
	import {
		SysUser
	} from '@/utils/sql/user'
	import {
		mapStores
	} from 'pinia'
	import {
		sqlite
	} from "@/utils/sql/index.js";

	export default {
		data() {
			return {
				seconds: 60,
				tips: '',
				screenHeight: '',
				loginForm: {
					username: null,
					// username: '18118046088',
					password: null,
					// password: '52lg1314',
					code: null,
					cilent_type: 'phone'
				},
				loginRule: [{
						name: 'username',
						checkType: "notnull",
						checkRule: "",
						errorMsg: "请输入登录账号"
					},
					{
						name: 'password',
						checkType: "notnull",
						checkRule: "",
						errorMsg: "请输入登录密码"
					}
				],
			}
		},
		computed: {
			...mapStores(useUserStore, useLoginStore)
		},
		onLoad() {
			this.screenHeight = uni.getSystemInfoSync().windowHeight; // 把页面高度定成视口高度
		},
		methods: {
			async handleLogin() {
				let checkRes = graceChecker.check(this.loginForm, this.loginRule);
				if (checkRes) {

					const loginMsg = await base.cloudLogin(this.loginForm);

					if (loginMsg.status == 1) {
						const data = {
							worker_id: loginMsg.data.worker_id,
							worker_name: loginMsg.data.worker_name,
							worker_no: loginMsg.data.worker_no,
							chat_account: loginMsg.data.chat_account,
							worker_type: loginMsg.data.worker_type,
							address: loginMsg.data.address,
							age: loginMsg.data.age,
							birth_date: loginMsg.data.birth_date,
							depart_id: loginMsg.data.depart_id,
							entry_date: loginMsg.data.entry_date,
							img_url: loginMsg.data.img_url,
							is_delete: loginMsg.data.is_delete,
							new_depart_name: loginMsg.data.new_depart_name,
							phone: loginMsg.data.phone,
							role_id: loginMsg.data.role_id,
							sex: loginMsg.data.sex,
							status: loginMsg.data.status,
							token: loginMsg.data.token,
						}

						// #ifdef APP-PLUS
						// 1.1.5 兼容chat_account字段，重建user表，1.1.6去除此段代码
						// 删除user表
						sqlite.dropTab('sys_user')
						SysUser.init().then(async (init) => {
							// 初始化user表
							SysUser.insert(data);
						}).catch(initErr => {
							console.log('初始化SQlite失败', initErr);
						})
						// #endif

						this.loginStore.login(loginMsg.data.token);
						this.userStore.setUser(loginMsg.data);
						uni.$emit('initJpush', loginMsg.data.phone)
						uni.$emit('playNotifyAudio', 'login');

						uni.reLaunch({
							// url: "/pages/chat/list/index"
							url: "/pages/workspace/home/index"
							// url: "/pages/dynamics/home/index"
						})
					} else {
						uni.$u.toast(loginMsg.msg);
					}
				} else {
					uni.$u.toast(graceChecker.error);
				}
			},
			resetForm() {
				this.loginForm = {
					username: null,
					password: null,
					code: null,
				}
			},
			handleForgot() {
				uni.navigateTo({
					url: '/pages/user/forgot'
				});
			}
		}
	}
</script>

<style lang="scss" scoped>
	page {
		overflow: hidden;
	}

	.container {
		position: relative;
	}

	.logo {
		padding: 320rpx 0 0 50rpx;
		display: flex;

		image {
			height: 158rpx;
			width: 162rpx;
		}

		.text-h {
			margin-top: 30rpx;
			font-size: 46rpx;
		}

		.text-f {
			margin-top: 28rpx;
		}
	}

	.form {
		padding: 50rpx 60rpx 0 50rpx;

		.input {
			margin-top: 36rpx;
		}

		input {
			background: #F6F6F6;
			border-radius: 56rpx;
			padding: 20rpx 30rpx 20rpx 40rpx;
		}
	}

	.forget {
		margin-top: 20rpx;
		padding: 0 68rpx;
		text-align: center;
		font-size: 24rpx;
		color: #777;
	}

	.submit {
		padding: 0 60rpx;
		margin-top: 40rpx;

		button {
			border-radius: 56rpx;
			height: 84rpx;
			font-size: 36rpx;
		}
	}
</style>